<div xmlns:f="http://java.sun.com/jsf/core"
     xmlns:h="http://java.sun.com/jsf/html">
    <div class="ui-widget ui-widget-header">
        Compute the volume of a cylinder
    </div>
    <h:form id='text-form'>
        <dl>
            <dt><label for='height'>Secret height</label></dt>
            <dd>
                <h:inputSecret id='height' size='10' value='#{compute.height}'
                               styleClass="ui-corner-all">
                    <f:converter converterId="float" />
                </h:inputSecret>
                <h:message for='height'/>
            </dd>
            <dt><label for='radius'>Secret radius</label></dt>
            <dd>
                <h:inputSecret id='radius' size='10' value='#{compute.radius}'
                               styleClass="ui-corner-all">
                    <f:converter converterId="float"/>
                </h:inputSecret>
                <h:message for='radius'/>
            </dd>
        </dl>
        <ul class='buttons'>
            <li>
                <h:commandButton id='run' value='Compute' action="#{compute.run}"
                                 styleClass="ui-button ui-state-default ui-corner-all"/>
            </li>
        </ul>
    </h:form>
</div>
